<template>
  <div>
    <el-dialog
      ref="refDlg"
      :title="flag==='detail' ? '详情' : (formData.id ? '编辑' : '新增')"
      :visible.sync="dialogShow"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      width="600"
      @close="handleBack"
    >
      <div>
        <el-form ref="refForm" class="financeForm" :rules="formRules" :model="formData" size="mini" label-width="100px">
          <el-row>
            <el-col :span="12">
              <el-form-item label="问题分类:" size="mini" prop="problemClass">
                <span v-if="flag === 'detail'">{{ formData.problemClass }}</span>
                <el-input v-else v-model="formData.problemClass" placeholder="请输入问题分类" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="验收类型:" size="mini" prop="acceptType">
                <span v-if="flag === 'detail'">{{ formaterData(acceptTypeList, formData.acceptType) }}</span>
                <!-- <el-select v-else v-model="formData.acceptType" placeholder="请选择验收类型" style="width:100%" @change="changeAcceptType">
                  <el-option v-for="item in acceptTypeList" :key="item.dictCode" :label="item.dictName" :value="item.dictCode" />
                </el-select> -->
                <c-dict-select v-else v-model="formData.acceptType" dict-type-code="ACCEPT_TYPE" placeholder="验收类型" @change="changeAcceptType" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="责任归属:" size="mini" prop="configAcceptDuty">
                <span v-if="flag === 'detail'">{{ formData.belongDuty }}</span>
                <input-with-dialog
                  v-else
                  v-model="formData.configAcceptDuty"
                  :props="{label:`belongDuty`,value:'id'}"
                  :config="acceptDutyConfig"
                  @change="acceptDutyChange"
                />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="启用状态:" size="mini" prop="enable">
                <span>{{ formaterData(enableList, formData.enable) }}</span>
                <!-- <el-input v-else v-model="formData.programName" placeholder="请输入问题分类" /> -->
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="创建人:" size="mini">
                <span>{{ formData.createBy }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="创建时间:" size="mini">
                <span>{{ formData.createTime }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="修改人:" size="mini">
                <span>{{ formData.lastUpdateBy }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="修改时间:" size="mini">
                <span>{{ formData.lastUpdateTime }}</span>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </div>
      <div slot="footer">
        <el-button size="mini" @click="handleBack">取消</el-button>
        <el-button type="primary" size="mini" @click="submitForm">确定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { getDictByPatchType } from '@/api/dataDict'
import { getClassifyDetail, submitClassifyForm } from '@/api/basicData'
import { getUserInfo } from '@/utils/auth'
export default {
  name: 'AddClassify',
  props: {
    visible: {
      type: Boolean,
      default: false,
      required: true
    },
    detailData: {
      type: [String, Object],
      default: ''
    }
  },
  data() {
    return {
      flag: '',
      acceptTypeList: [],
      hasDuty: false,
      formData: {
        problemClass: '',
        acceptType: '',
        configAcceptDuty: [],
        enable: 1,
        createBy: '',
        createTime: '',
        lastUpdateBy: '',
        lastUpdateTime: ''
      },
      formRules: {
        problemClass: [{ required: true, message: '请输入问题分类' }],
        acceptType: [{ required: true, message: '请选择验收类型' }],
        configAcceptDuty: [{ required: true, message: '请选择责任归属' }]
      },
      enableList: [
        { dictName: '启用', dictCode: 1 },
        { dictName: '停用', dictCode: 0 }
      ],
      acceptDutyConfig: {
        title: '责任归属',
        interfacePath: `${process.env.VUE_APP_BASE_API}/api/v1/configAcceptDuty/page`,
        setting: [
          {
            prop: 'acceptTypeName',
            title: '验收类型'
          },
          {
            prop: 'belongDuty',
            title: '责任归属'
          }
        ],
        filtersRaw: [{ 'id': 'enable', 'property': 'enable', 'operator': '=', 'value': '1' }]
      }
    }
  },
  computed: {
    dialogShow: {
      get() {
        return this.visible
      },
      set(val) {
        this.$emit('update:visible', val)
      }
    }
  },
  async created() {
    await this.getDictByPatchTypeAll(['ACCEPT_TYPE']).then(res => {
      this.acceptTypeList = res.ACCEPT_TYPE
    })
    if (this.detailData.data) {
      this.flag = this.detailData.flag
      getClassifyDetail(this.detailData.data.id).then(res => {
        if (res.success) {
          this.formData = res.data
          const otherFilter = [{ 'id': 'acceptType', 'property': 'acceptType', 'operator': '=', 'value': this.formData.acceptType }]
          this.$set(this.acceptDutyConfig, 'filtersRaw', otherFilter)
          const configAcceptDuty = [{ label: this.formData.belongDuty, value: this.formData.configAcceptDutyId }]
          this.$set(this.formData, 'configAcceptDuty', configAcceptDuty)
        }
      })
    } else {
      const { userName } = getUserInfo()
      this.formData.createBy = userName
      this.formData.createTime = this.getNowTime()
    }
  },
  methods: {
    // 获取数据字典
    async getDictByPatchTypeAll(data) {
      const obj = await getDictByPatchType(data)
        .then(res => {
          return res
        })
      return obj
    },
    // 格式化数据
    formaterData(arr, dictCode) {
      if (!arr || !arr.length) return
      const tmpArr = arr.filter(item => item.dictCode === dictCode)
      if (tmpArr.length) {
        return tmpArr[0].dictName
      }
      return dictCode
    },
    // 获取时间
    getNowTime() {
      const date = new Date()
      const year = date.getFullYear()
      const month = this.isAddZero(date.getMonth() + 1)
      const day = this.isAddZero(date.getDate())
      const hh = this.isAddZero(date.getHours())
      const mm = this.isAddZero(date.getMinutes())
      const ss = this.isAddZero(date.getSeconds())
      return `${year}-${month}-${day} ${hh}:${mm}:${ss}`
    },
    isAddZero(data) {
      if (data < 10) {
        return '0' + data
      }
      return data
    },
    // 选择验收类型
    changeAcceptType(value) {
      const otherFilter = [{ 'id': 'acceptType', 'property': 'acceptType', 'operator': '=', 'value': value },
        { 'id': 'enable', 'property': 'enable', 'operator': '=', 'value': '1' }]
      this.$set(this.acceptDutyConfig, 'filtersRaw', otherFilter)
      this.formData.configAcceptDuty = []
      this.formData.configAcceptDutyId = ''
    },
    // 选择责任归属
    acceptDutyChange(row) {
      this.formData.configAcceptDutyId = row[0].id
      this.formData.belongDuty = row[0].belongDuty
    },
    // 取消
    handleBack() {
      this.dialogShow = false
      this.clearForm()
    },
    // 清空表单
    clearForm(done) {
      this.formData = {}
      this.$refs.refForm && this.$refs.refForm.clearValidate()
      done && done()
    },
    submitForm() {
      this.$refs.refForm.validate((valid) => {
        if (valid) {
          submitClassifyForm(this.formData).then(res => {
            if (res.success) {
              this.$message.success('操作成功')
              this.dialogShow = false
              this.clearForm()
              const isNew = !this.formData.id
              this.$emit('success', isNew)
            }
          })
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
